<template>
  <div>
    <div class="header">员工信息</div>
    <el-form
      ref="entryApplyForm"
      v-loading="loading"
      :model="entryApplyForm"
      :rules="entryApplyRules"
      label-width="0px"
      :disabled="true"
    >
      <div class="entryTableHeader">
        <table style="width: 90%;">
          <tr>
            <td width="30%" class="departwrapper">
              <el-form-item label="部门" label-width="100px">
                <div>
                  {{ main_dept_name }}
                </div>
              </el-form-item>
            </td>
            <td width="30%" class="postwrapper">
              {{ main_dept_post }}
            </td>
            <td width="10%" style="text-align: right;">填表日期：</td>
            <td width="10%">{{ entryApplyForm.created_at | formatDate }}</td>
          </tr>
        </table>
      </div>
      <table class="entryTable">
        <tr class="firstTr">
          <td width="10%" class="firstTd required title">姓名</td>
          <td width="12%">
            {{ entryApplyForm.name ? entryApplyForm.name : '暂未填写姓名' }}
          </td>
          <td width="10%" class="required title">性别</td>
          <td width="12%">
            {{ entryApplyForm.sex ? entryApplyForm.sex : '暂未填写' }}
            <!--              <el-radio-group v-model="entryApplyForm.sex">-->
            <!--                <el-radio label="男">男</el-radio>-->
            <!--                <el-radio label="女">女</el-radio>-->
            <!--              </el-radio-group>-->
          </td>
          <td width="10%" class="required title">出生日期</td>
          <td width="12%">
            {{ entryApplyForm.birth ? entryApplyForm.birth : '暂未填写' }}
            <!--            <el-form-item prop="birth">-->

            <!--              <el-date-picker-->
            <!--                v-model="entryApplyForm.birth"-->
            <!--                clearable-->
            <!--                type="date"-->
            <!--                placeholder="暂未填写出生日期"-->
            <!--                format="yyyy年MM月dd日"-->
            <!--                value-format="yyyy-MM-dd"-->
            <!--                style="width:100%"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td width="10%" class="title" v-html="'&emsp;政治面貌'"/>
          <td width="12%">
            {{ entryApplyForm.political_landspace ? entryApplyForm.political_landspace : '暂未填写' }}
            <!--            <el-form-item prop="political_landspace">-->
            <!--              <el-select-->
            <!--                v-model="entryApplyForm.political_landspace"-->
            <!--                filterable-->
            <!--                clearable-->
            <!--                placeholder="暂未填写政治面貌"-->
            <!--                style="width:100%"-->
            <!--              >-->
            <!--                <el-option v-for="item in politicalList" :key="item.code" :label="item.name" :value="item.name">-->
            <!--                  {{ item.name }}-->
            <!--                </el-option>-->
            <!--              </el-select>-->
            <!--            </el-form-item>-->
          </td>
          <td rowspan="4">
            <el-form-item prop="avatar">
              照片
              <upload-image
                style="margin-left:30px;"
                :cur-image-prop="entryApplyForm.avatar"
                :lt-size-prop="2"
                has-del-btn
                @upload-success="handleUploadImageSuccess"
                @upload-remove="handleUploadImageRemove"
              />
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td class="firstTd required title">籍贯</td>
          <td>
            {{ entryApplyForm.native_place ? entryApplyForm.native_place : '暂未填写' }}
            <!--            <el-form-item prop="native_place">-->
            <!--              <el-input v-model="entryApplyForm.native_place" placeholder="暂未填写籍贯"/>-->
            <!--            </el-form-item>-->
          </td>
          <td class="required title">民族</td>
          <td>
            {{ entryApplyForm.national ? entryApplyForm.national : '暂未填写' }}
            <!--            <el-form-item prop="national">-->
            <!--              <el-select-->
            <!--                v-model="entryApplyForm.national"-->
            <!--                filterable-->
            <!--                clearable-->
            <!--                placeholder="暂未填写民族"-->
            <!--                style="width:100%"-->
            <!--              >-->
            <!--                <el-option v-for="item in nationalList" :key="item.code" :label="item.name" :value="item.name">-->
            <!--                  {{ item.name }}-->
            <!--                </el-option>-->
            <!--              </el-select>-->
            <!--            </el-form-item>-->
          </td>
          <td v-html="'&emsp;婚姻情况'" class="title"/>
          <td>
            {{ entryApplyForm.marriage ? entryApplyForm.marriage : '暂未填写' }}
            <!--            <el-form-item prop="marriage">-->
            <!--              <el-select-->
            <!--                v-model="entryApplyForm.marriage"-->
            <!--                filterable-->
            <!--                clearable-->
            <!--                placeholder="暂未填写婚姻情况"-->
            <!--                style="width:100%"-->
            <!--              >-->
            <!--                <el-option v-for="item in marriageList" :key="item.code" :label="item.name" :value="item.name">-->
            <!--                  {{ item.name }}-->
            <!--                </el-option>-->
            <!--              </el-select>-->
            <!--            </el-form-item>-->
          </td>
          <td class="required title">文化程度</td>
          <td>
            {{ entryApplyForm.degree ? entryApplyForm.degree : '暂未填写' }}
            <!--            <el-form-item prop="degree">-->
            <!--              <el-select-->
            <!--                v-model="entryApplyForm.degree"-->
            <!--                filterable-->
            <!--                clearable-->
            <!--                placeholder="暂未填写文化程度"-->
            <!--                style="width:100%"-->
            <!--              >-->
            <!--                <el-option v-for="item in degreeList" :key="item.code" :label="item.name" :value="item.name">-->
            <!--                  {{ item.name }}-->
            <!--                </el-option>-->
            <!--              </el-select>-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td class="firstTd required title">身份证号码</td>
          <td colspan="4">
            {{ entryApplyForm.id_no ? entryApplyForm.id_no : '暂未填写' }}
            <!--            <el-form-item prop="id_no">-->
            <!--              <el-input v-model="entryApplyForm.id_no" placeholder="暂未填写身份证号码"/>-->
            <!--            </el-form-item>-->
          </td>
          <td class="required">联系电话</td>
          <td colspan="2">
            {{ entryApplyForm.mobile ? entryApplyForm.mobile : '暂未填写' }}
            <!--            <el-form-item prop="mobile">-->
            <!--              <el-input v-model="entryApplyForm.mobile" placeholder="暂未填写联系电话"/>-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td class="firstTd required title">户籍所在地</td>
          <td colspan="4">
            {{ entryApplyForm.household_registration ? entryApplyForm.household_registration : '暂未填写' }}
            <!--            <el-form-item prop="household_registration">-->
            <!--              <el-input v-model="entryApplyForm.household_registration" placeholder="暂未填写户籍所在地"/>-->
            <!--            </el-form-item>-->
          </td>
          <td class="required title">紧急联系人电话</td>
          <td colspan="2">
            {{ entryApplyForm.urgent_phone ? entryApplyForm.urgent_phone : '暂未填写' }}
            <!--            <el-form-item prop="urgent_phone">-->
            <!--              <el-input v-model="entryApplyForm.urgent_phone" placeholder="暂未填写紧急联系人电话"/>-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td class="firstTd required title">现居住地址</td>
          <td colspan="4">
            {{ entryApplyForm.home_address ? entryApplyForm.home_address : '暂未填写' }}
            <!--            <el-form-item prop="home_address">-->
            <!--              <el-input v-model="entryApplyForm.home_address" placeholder="暂未填写现居住地址"/>-->
            <!--            </el-form-item>-->
          </td>
          <td class="title">QQ号码</td>
          <td colspan="3">
            {{ entryApplyForm.qq ? entryApplyForm.qq : '暂未填写' }}
            <!--            <el-form-item prop="qq">-->
            <!--              <el-input v-model="entryApplyForm.qq" placeholder="暂未填写QQ号码"/>-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td
            class="firstTd title"
            :rowspan="[entryApplyForm.work_experiences != null?entryApplyForm.work_experiences.length+1:1]"
          >
            工作经验
          </td>
          <td colspan="2" class="title">
            起止年月
          </td>
          <td colspan="2" class="title">
            工作单位
          </td>
          <td colspan="2" class="title">
            职位
          </td>
          <td colspan="2" class="title">
            离职原因
          </td>
        </tr>
        <tr v-for="item in entryApplyForm.work_experiences">
          <td colspan="2">
            {{ item.start_time && item.end_time ? item.start_time + '-' + item.end_time : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-date-picker-->
            <!--                :value="formatDate()"-->
            <!--                type="daterange"-->
            <!--                range-separator="—"-->
            <!--                start-placeholder="开始日期"-->
            <!--                end-placeholder="结束日期"-->
            <!--                @change="(value) => work_experience_date_change(value,index)"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.company ? item.company : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input-->
            <!--                v-model="item.company"-->
            <!--                placeholder="暂未填写工作单位"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.job ? item.job : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input-->
            <!--                v-model="item.job"-->
            <!--                placeholder="暂未填写职位"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.leave_reason ? item.leave_reason : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input-->
            <!--                v-model="item.leave_reason"-->
            <!--                placeholder="暂未填写离职原因"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td class="firstTd title"
              :rowspan="[entryApplyForm.family_members != null?entryApplyForm.family_members.length+1:1]"
          >
            家族成员
          </td>
          <td colspan="2" class="title">
            姓名
          </td>
          <td colspan="2" class="title">
            工作单位
          </td>
          <td colspan="2" class="title">
            职务
          </td>
          <td colspan="2" class="title">
            电话
          </td>
        </tr>
        <tr v-for="(item) in entryApplyForm.family_members">
          <td colspan="2">
            {{ item.name ? item.name : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input v-model="item.name" placeholder="暂未填写姓名"/>-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.company ? item.company : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input v-model="item.company" placeholder="暂未填写工作单位"/>-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.job ? item.job : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input v-model="item.job" placeholder="暂未填写职务"/>-->
            <!--            </el-form-item>-->
          </td>
          <td colspan="2">
            {{ item.mobile ? item.mobile : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-input v-model="item.mobile" placeholder="暂未填写电话"/>-->
            <!--            </el-form-item>-->
          </td>
        </tr>
        <tr>
          <td class="firstTd title">
            能否接受工作调动
          </td>
          <td colspan="2">
            <el-form-item>
              {{ entryApplyForm.dispatch == 1 ? '是' : entryApplyForm.dispatch == 0 ? '否' : '暂未填写' }}
              <!--              <el-radio-group v-model="entryApplyForm.dispatch">-->
              <!--                <el-radio :label="1">是</el-radio>-->
              <!--                <el-radio :label="0">否</el-radio>-->
              <!--              </el-radio-group>-->
            </el-form-item>
          </td>
          <td class="title">
            能否加班
          </td>
          <td colspan="2">
            <el-form-item>
              {{ entryApplyForm.work_overtime == 1 ? '是' : entryApplyForm.work_overtime == 0 ? '否' : '暂未填写' }}
              <!--              <el-radio-group v-model="entryApplyForm.work_overtime">-->
              <!--                <el-radio :label="1">是</el-radio>-->
              <!--                <el-radio :label="0">否</el-radio>-->
              <!--              </el-radio-group>-->
            </el-form-item>
          </td>
          <td class="title">
            能否出差
          </td>
          <td colspan="2">
            <el-form-item prop="business_trip">
              {{ entryApplyForm.business_trip == 1 ? '是' : entryApplyForm.business_trip == 0 ? '否' : '暂未填写' }}
              <!--              <el-radio-group v-model="entryApplyForm.business_trip">-->
              <!--                <el-radio :label="1">是</el-radio>-->
              <!--                <el-radio :label="0">否</el-radio>-->
              <!--              </el-radio-group>-->
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td class="firstTd title" colspan="2">
            是否曾在我公司应聘
          </td>
          <td colspan="2">
            <el-form-item prop="employed">
              {{ entryApplyForm.employed == 1 ? '是' : entryApplyForm.employed == 0 ? '否' : '暂未填写' }}
              <!--              <el-radio-group v-model="entryApplyForm.employed">-->
              <!--                <el-radio :label="1">是</el-radio>-->
              <!--                <el-radio :label="0">否</el-radio>-->
              <!--              </el-radio-group>-->
            </el-form-item>
          </td>
          <td colspan="3" class="title">
            是否有亲属或朋友在我司工作
          </td>
          <td colspan="3">
            <el-form-item prop="employed_friends">
              {{ entryApplyForm.employed_friends == 1 ? '是' : entryApplyForm.employed_friends == 0 ? '否' : '暂未填写' }}
              <!--              <el-radio-group v-model="entryApplyForm.employed_friends">-->
              <!--                <el-radio :label="1">是</el-radio>-->
              <!--                <el-radio :label="0">否</el-radio>-->
              <!--              </el-radio-group>-->
              <!--              <el-input-->
              <!--                v-if="entryApplyForm.employed_friends"-->
              <!--                v-model="entryApplyForm.employed_relatives_friends_name"-->
              <!--                placeholder="暂未填写姓名"-->
              <!--              />-->
              <div v-if="entryApplyForm.employed_friends == 1">
                {{
                  entryApplyForm.employed_relatives_friends_name ? entryApplyForm.employed_relatives_friends_name : '暂未填写姓名'
                }}
              </div>
            </el-form-item>
          </td>
        </tr>
        <tr>
          <td class="firstTd title">
            填表人申明
          </td>
          <td colspan="8" style="text-align:left;">
            <div>1、本人保证所填写资料属实</div>
            <div>2、保证遵守公司各项规章制度</div>
            <div>3、若有不实之处，本人愿意无条件接受公司处罚甚至辞退，并不要求任何补助。</div>
            <div class="sign">申&nbsp;明&nbsp;人：</div>
          </td>
        </tr>
        <tr>
          <td class="firstTd title">
            入职培训
          </td>
          <td colspan="8" style="text-align:left">
            <div>本人已接受公司岗前及员工规章制度的培训。</div>
            <div class="sign">
              <span>员工签字：</span> <span style="margin-left:150px;"/>
            </div>
          </td>
        </tr>
        <tr>
          <td class="firstTd title">
            入编时间
          </td>
          <td colspan="2">
            {{ entryApplyForm.comp_fill_entry_date ? entryApplyForm.comp_fill_entry_date : '暂未填写' }}
            <!--            <el-form-item>-->
            <!--              <el-date-picker-->
            <!--                v-model="entryApplyForm.comp_fill_entry_date"-->
            <!--                type="date"-->
            <!--                placeholder="暂未填写入编时间"-->
            <!--                style="width:100%"-->
            <!--                format="yyyy年MM月dd日"-->
            <!--                value-format="yyyy-MM-dd"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td class="title">
            所属部门
          </td>
          <td colspan="2">
            {{ entryApplyForm.comp_fill_belong_dep ? entryApplyForm.comp_fill_belong_dep : '暂未填写' }}
          </td>
          <td class="title">
            职务
          </td>
          <td colspan="2">
            {{ entryApplyForm.comp_fill_job ? entryApplyForm.comp_fill_job : '暂未填写' }}
          </td>
        </tr>
        <tr>
          <td class="firstTd required title">
            考察期
          </td>
          <td colspan="2">
            {{
              entryApplyForm.comp_fill_probation_start && entryApplyForm.comp_fill_probation_end ? entryApplyForm.comp_fill_probation_start + '-' + entryApplyForm.comp_fill_probation_end : '暂未填写'
            }}
            <!--            <el-form-item>-->
            <!--              <el-date-picker-->
            <!--                :value="formatDate(entryApplyForm.comp_fill_probation_start,entryApplyForm.comp_fill_probation_end)"-->
            <!--                type="daterange"-->
            <!--                range-separator="至"-->
            <!--                start-placeholder="开始日期"-->
            <!--                end-placeholder="结束日期"-->
            <!--              />-->
            <!--            </el-form-item>-->
          </td>
          <td class="required title">
            考察期工资
          </td>
          <td colspan="2">
            {{ entryApplyForm.comp_fill_probation_salary ? entryApplyForm.comp_fill_probation_salary : '暂未填写' }}
            <!--            <el-form-item prop="comp_fill_probation_salary">-->
            <!--              <el-input v-model="entryApplyForm.comp_fill_probation_salary" placeholder="暂未填写考察期工资">-->
            <!--              </el-input>-->
            <!--            </el-form-item>-->
          </td>
          <td class="required title">
            入编后工资
          </td>
          <td colspan="2">
            {{ entryApplyForm.comp_fill_salary ? entryApplyForm.comp_fill_salary : '暂未填写' }}
            <!--            <el-form-item prop="comp_fill_salary">-->
            <!--              <el-input v-model="entryApplyForm.comp_fill_salary" placeholder="暂未填写入编后工资">-->
            <!--              </el-input>-->
            <!--            </el-form-item>-->
            <div>
              补充说明：{{ entryApplyForm.comp_fill_salary_remark ? entryApplyForm.comp_fill_salary_remark : '暂未填写' }}
            </div>
          </td>
        </tr>
        <tr>
          <td class="firstTd title">
            合同签订时间
          </td>
          <td colspan="2">
            {{ entryApplyForm.contract_sign_at ? entryApplyForm.contract_sign_at : '暂未填写' }}
            <!--            <el-date-picker-->
            <!--              v-model="entryApplyForm.contract_sign_at"-->
            <!--              type="date"-->
            <!--              placeholder="暂未填写"-->
            <!--              style="width: 100%"-->
            <!--            >-->
            <!--            </el-date-picker>-->
          </td>
          <td class="firstTd title">
            年限
          </td>
          <td colspan="2">
            {{
              entryApplyForm.years_begin && entryApplyForm.years_end ? entryApplyForm.years_begin + '-' + entryApplyForm.years_end : '暂未填写'
            }}
            <!--            <el-date-picker-->
            <!--              :value="formatDate(entryApplyForm.years_begin,entryApplyForm.years_end)"-->
            <!--              type="daterange"-->
            <!--              range-separator="-"-->
            <!--              start-placeholder="暂未填写"-->
            <!--              end-placeholder="暂未填写"-->
            <!--            >-->
            <!--            </el-date-picker>-->
          </td>
          <td class="firstTd title">
            是否签订保密协议
          </td>
          <td colspan="2">
            {{
              entryApplyForm.sign_confidentiality_agree == 1 ? '是' : entryApplyForm.sign_confidentiality_agree == 0 ? '否' : '暂未填写'
            }}
            <!--            <el-radio-group v-model="entryApplyForm.sign_confidentiality_agree">-->
            <!--              <el-radio :label="1">是</el-radio>-->
            <!--              <el-radio :label="0">否</el-radio>-->
            <!--            </el-radio-group>-->
          </td>
        </tr>
      </table>
    </el-form>
    <div style="text-align: center;margin-bottom: 30px">
      <el-button icon="el-icon-back" @click="closePage">返回</el-button>
    </div>
  </div>
</template>

<script>
import { formatDateByFmt } from '@/utils/util.js'
import { list_all3rd_bycode } from '@/api/business/setting/dict.js'
import UploadImage from '@/components/UploadImage'
import { list as getDepartmentList } from '@/api/system/department.js'
import { detail } from '@/api/personnel/org/roster'

export default {
  name: 'roster_details',
  components: {
    UploadImage
  },
  filters: {
    formatDate(time) {
      if (time) {
        return formatDateByFmt(time, 'yyyy年MM月dd日')
      }
    }
  },
  computed: {
    main_dept_name() {
      const tmp = this.entryApplyForm.department_list.find(item => {
        if (item.main) {
          return item
        }
      })
      if (tmp) {
        return tmp.name
      } else {
        return ''
      }
    },
    main_dept_post() {
      const tmp = this.entryApplyForm.department_list.find(item => {
        if (item.main) {
          return item
        }
      })
      if (tmp) {
        return tmp.job
      } else {
        return ''
      }
    }
  },
  data() {
    return {
      loading: false,
      politicalList: [],
      nationalList: [],
      marriageList: [],
      degreeList: [],
      departmentList: [],
      // 政治面貌 param
      politicalParam: {
        code: 'ryxg-zzmm'
      },
      // 民族 param
      nationalParam: {
        code: 'ryxg-mz'
      },
      // 婚姻状况 param
      marriageParam: {
        code: 'ryxg-hyqk'
      },
      // 文化程度 param
      degreeParam: {
        code: 'ryxg-whcd'
      },
      entryApplyForm: {
        can_check: false,
        is_applyer: true,
        isNewData: true,
        entry_dep_id: 0,
        entry_job: null,
        created_at: new Date(),
        name: null,
        sex: '男',
        birth: null,
        avatar: null,
        political_landspace: null,
        native_place: null,
        national: null,
        marriage: null,
        degree: null,
        id_no: null,
        mobile: null,
        household_registration: null,
        urgent_phone: null,
        home_address: null,
        work_experiences: [{
          company: null,
          work_date: null,
          start_time: null,
          end_time: null,
          job: null,
          leave_reason: null
        }],
        family_members: [{
          company: null,
          job: null,
          mobile: null,
          name: null
        }],
        dispatch: null,
        work_overtime: null,
        business_trip: null,
        employed: null,
        employed_friends: null,
        employed_relatives_friends_name: null,
        comp_fill_entry_date: null,
        comp_fill_belong_dep_id: null,
        comp_fill_belong_dep: null,
        comp_fill_job: null,
        comp_fill_probation: null,
        comp_fill_probation_salary: null,
        comp_fill_salary: null,
        comp_fill_salary_remark: null,
        department_list: [
          {
            id: null,
            job: null
          }
        ]
      },
      entryApplyRules: {
        entry_dep_id: [
          { required: true, message: '请选择部门', trigger: ['change'] }
        ],
        social_security_dep_name: [
          { required: true, message: '请填写岗位信息', trigger: ['blur'] }
        ],
        name: [
          { required: true, message: '暂未填写姓名', trigger: ['blur', 'change'] }
        ],
        sex: [
          { required: true, message: '请选择性别', trigger: ['blur', 'change'] }
        ],
        birth: [
          { required: true, message: '请选择生日', trigger: ['blur', 'change'] }
        ],
        native_place: [
          { required: true, message: '请输入籍贯', trigger: ['blur', 'change'] }
        ],
        national: [
          { required: true, message: '请选择民族', trigger: ['blur', 'change'] }
        ],
        degree: [
          { required: true, message: '请选择文化程度', trigger: ['blur', 'change'] }
        ],
        id_no: [
          { required: true, message: '请输入身份证号', trigger: ['blur', 'change'] },
          { pattern: /(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/, message: '身份证号格式不正确', trigger: ['blur', 'change'] }
        ],
        mobile: [
          { required: true, message: '请输入联系电话', trigger: ['blur', 'change'] }
        ],
        household_registration: [
          { required: true, message: '请输入户籍所在地', trigger: ['blur', 'change'] }
        ],
        urgent_phone: [
          { required: true, message: '请输入紧急联系人电话', trigger: ['blur', 'change'] }
        ],
        home_address: [
          { required: true, message: '请输入现居住地址', trigger: ['blur', 'change'] }
        ],
        comp_fill_probation: [
          { required: true, message: '请选择考察期', trigger: ['blur', 'change'] }
        ],
        comp_fill_probation_salary: [
          { required: true, message: '请输入考察期工资', trigger: ['blur', 'change'] }
        ],
        comp_fill_salary: [
          { required: true, message: '请输入入编后工资', trigger: ['blur', 'change'] }
        ]
      }
    }
  },
  watch: {
    'entryApplyForm.entry_job'(val) {
      this.entryApplyForm.comp_fill_job = val
    }
  },
  created() {
    this.getPoliticalList()
    this.getNationalList()
    this.getMarriageList()
    this.getDegreeList()
    this.getDepartmentList()
    const params = this.$route.params
    if (params.user_id) {
      this.getDetailById(params.user_id)
    }
  },
  mounted() {
    this.view = {
      name: this.$route.name
    }
  },
  methods: {
    // 获取政治面貌
    getPoliticalList() {
      return list_all3rd_bycode(this.politicalParam)
        .then(res => {
          this.politicalList = res.data
        })
    },
    // 获取民族
    getNationalList() {
      return list_all3rd_bycode(this.nationalParam)
        .then(res => {
          this.nationalList = res.data
          if (this.nationalList != null && this.nationalList.length > 0 && this.entryApplyForm.national == null) {
            this.entryApplyForm.national = this.nationalList[0].id
          }
        })
    },
    // 获取婚姻情况
    getMarriageList() {
      return list_all3rd_bycode(this.marriageParam)
        .then(res => {
          this.marriageList = res.data
        })
    },
    // 获取文化程度
    getDegreeList() {
      return list_all3rd_bycode(this.degreeParam)
        .then(res => {
          this.degreeList = res.data
        })
    },
    // 获取部门信息
    getDepartmentList() {
      return getDepartmentList().then(res => {
        this.departmentList = res.data
      })
    },
    work_experience_date_change(val, index) {
      const startTime = formatDateByFmt(val[0], 'yyyy-MM-dd')
      const endTime = formatDateByFmt(val[1], 'yyyy-MM-dd')
      this.entryApplyForm.work_experiences[index].start_time = startTime
      this.entryApplyForm.work_experiences[index].end_time = endTime
    },
    // 图片上传成功回调方法
    handleUploadImageSuccess(url) {
      this.entryApplyForm.avatar = url
    },
    handleUploadImageRemove() {
      this.entryApplyForm.avatar = null
    },
    //获取员工详情
    getDetailById(id) {
      this.loading = true
      detail({ id: id }).then(
        res => {
          this.entryApplyForm = res.data
          console.log(this.entryApplyForm)
          this.$refs['depTreeSelect'].checkSelectedNode([this.entryApplyForm.department_list[0].id])
          this.loading = false
          this.$nextTick(() => {
            this.$refs['entryApplyForm'].clearValidate()
          })
        }
      ).catch(
        () => {
          this.loading = false
        }
      )
    },
    closePage() {
      this.$store.dispatch('tagsView/closePage', this.view.name)
    },
    /**
     * 获取选择框中的数据
     * @param arr 选择框的列表List
     * @param keyName option中的value属性的字段名称
     * @param value 选择框中的v-model属性值
     * @param fieldName option中的liable属性的字段名称
     * @returns {*|string}
     */
    getNameByIdAsArr(arr, keyName, value, fieldName) {
      const tmp = arr.find(item => {
        console.log('属性值' + item[keyName])
        console.log('值' + value)
        if (item[keyName] == value) {
          return item
        }
      })
      if (tmp) {
        debugger
        return tmp[fieldName] ? tmp[fieldName] : '暂未填写'
      }
    }
  }
}
</script>

<style scoped lang="scss">

.entryTableHeader {
  width: 90%;
  height: 50px;
  font-size: 14px;
  margin: 0 auto;
  text-align: center;
  font-weight: bold;
  margin-bottom: 10px;
}

.entryTable {
  width: 90%;
  font-size: 14px;
  margin: 0 auto 30px auto;
  border-collapse: collapse;

}

.entryTable tr td {
  height: 60px;
  line-height: 35px;
  box-sizing: border-box;
  padding: 0 10px;
  border-bottom: 1px solid #E6EAEE;
  border-right: 1px solid #E6EAEE;
  text-align: center;
}

.firstTr td {
  border-top: 1px solid #E6EAEE;
}

.firstTd {
  border-left: 1px solid #E6EAEE;
}

.header {
  padding-top: 20px;
  text-align: center;
  font-size: 25px;
  font-weight: bold;
  margin: 20px auto;
}

.tip {
  color: red;
}

.textarea-box {
  padding: 10px !important;
}

.follow_table {
  margin-top: 20px;
}

.button_group {
  margin: 20px auto;
  text-align: center;
}

.no_last {
  padding-top: 37px;
}

/deep/ .el-form-item {
  margin-bottom: 0;
}

.error_box {
  margin-bottom: 22px;
}

.button_box {
  text-align: center;
  margin-top: -10px;
  padding-bottom: 10px;
}

/deep/ .el-dialog__title {
  font-size: 14px;
}

.sign {
  float: right;
  width: 400px;
  text-align: left;
}

.departwrapper /deep/ .el-input__inner,
.postwrapper /deep/ .el-input__inner {
  border: none;
}

.departwrapper /deep/ .el-form-item__label,
.postwrapper /deep/ .el-form-item__label {
  margin-top: 3px;
  color: #000;
}

.required:before {
  content: "*";
  color: #F56C6C;
  margin-right: 4px;
}

///deep/ .el-input__inner{
//  border: none;
//}
/deep/ .el-input.is-disabled .el-input__inner {
  background-color: white;
  color: black;
  border: none;
  cursor: default
}

/deep/ .el-range-editor.is-disabled {
  background-color: white;
  border: none;
}

/deep/ .el-range-editor.is-disabled input {
  background-color: white;
  color: black;
}

/deep/ .el-radio__input.is-disabled + span.el-radio__label {
  color: black;
}

/deep/ .el-radio__input.is-checked .el-radio__inner {
  border-color: #409EFF;
  background: #409EFF
}

/deep/ .el-radio__input.is-disabled.is-checked .el-radio__inner::after {
  width: 4px;
  height: 4px;
  border-radius: 100%;
  background-color: #FFF;
}

/deep/ .el-input__suffix {
  display: none;
}

/deep/ .el-input__prefix {
  display: none;
}

/deep/ .el-input__icon {
  display: none;
}

.title {
  background: #F5F7FA;
  font-weight: bold;
}
</style>
